/**
 * 输入监听工具类
 * 用于监听编辑器输入事件，每打一个字就触发回调
 */
export class InputListener {
  constructor(options = {}) {
    this.options = {
      // 是否启用调试模式
      debug: false,
      // 是否打印到控制台
      consoleLog: true,
      // 回调函数
      onInput: null,
      // 字数变化回调
      onWordCountChange: null,
      // 内容变化回调
      onContentChange: null,
      // 变量触发回调
      onVariableTrigger: null,
      ...options
    }
    
    this.lastContent = ''
    this.lastTextContent = ''
    this.lastWordCount = 0
    this.isListening = false
  }

  /**
   * 开始监听输入事件
   * @param {HTMLElement} editorElement - 编辑器DOM元素
   */
  startListening(editorElement) {
    if (!editorElement) {
      console.error('InputListener: 编辑器元素不能为空')
      return
    }

    this.editorElement = editorElement
    this.isListening = true
    
    // 绑定输入事件
    this.editorElement.addEventListener('input', this.handleInput.bind(this))
    
    if (this.options.debug) {
      console.log('InputListener: 开始监听输入事件')
    }
  }

  /**
   * 停止监听输入事件
   */
  stopListening() {
    if (this.editorElement) {
      this.editorElement.removeEventListener('input', this.handleInput.bind(this))
      this.isListening = false
      
      if (this.options.debug) {
        console.log('InputListener: 停止监听输入事件')
      }
    }
  }

  /**
   * 处理输入事件
   * @param {Event} event - 输入事件对象
   */
  handleInput(event) {
    if (!this.isListening) return

    const currentContent = this.editorElement.innerHTML
    const currentTextContent = this.editorElement.textContent
    const currentWordCount = currentTextContent.length
    
    // 检查内容是否真的发生了变化
    if (currentContent !== this.lastContent) {
      // 检查是否输入了 { 字符（通过比较文本内容）
      const lastTextContent = this.lastTextContent || ''
      if (currentTextContent.length > lastTextContent.length) {
        const newText = currentTextContent.slice(lastTextContent.length)
        if (newText.includes('{') || newText.includes('｛')) {
          console.log('🎯 检测到 { 字符输入!')
          console.log('📝 新输入的内容:', newText)
          console.log('📍 光标位置:', this.getCursorPosition())
          console.log('📄 当前完整内容:', currentTextContent)
          this.triggerVariableMenu()
        }
      }
      
      this.lastContent = currentContent
      this.lastTextContent = currentTextContent
      
      // 检查是否输入了 { 字符（通过光标位置检查）
      const hasBrace = this.checkForBraceInput()
      if (hasBrace) {
        console.log('🔍 通过光标位置检测到 { 字符输入')
        console.log('📍 光标位置:', this.getCursorPosition())
        console.log('📝 当前内容:', currentContent)
        this.triggerVariableMenu()
      }
      
      // 打印调试信息
      if (this.options.consoleLog) {
        this.logInput('', currentContent, currentWordCount)
      }
      
      // 触发回调函数
      this.triggerCallbacks('', currentContent, currentWordCount)
    }
  }

  /**
   * 检查是否输入了 { 字符
   * @returns {boolean} 是否检测到 { 字符
   */
  checkForBraceInput() {
    const selection = window.getSelection()
    if (selection.rangeCount === 0) return false
    
    const range = selection.getRangeAt(0)
    const textNode = range.startContainer
    
    // 检查当前文本节点是否包含 { 字符
    if (textNode.nodeType === Node.TEXT_NODE) {
      const text = textNode.textContent
      const offset = range.startOffset
      
      // 检查光标位置是否有 { 字符（支持中文和英文大括号）
      if (offset > 0) {
        const charBeforeCursor = text[offset - 1]
        if (charBeforeCursor === '{' || charBeforeCursor === '｛') {
          console.log('✅ 确认检测到 { 字符:', charBeforeCursor)
          return true
        }
      }
    }
    
    return false
  }

  /**
   * 获取光标位置信息
   * @returns {Object} 光标位置信息
   */
  getCursorPosition() {
    const selection = window.getSelection()
    if (selection.rangeCount === 0) return null
    
    const range = selection.getRangeAt(0)
    const textNode = range.startContainer
    
    if (textNode.nodeType === Node.TEXT_NODE) {
      return {
        offset: range.startOffset,
        textContent: textNode.textContent,
        charBeforeCursor: textNode.textContent[range.startOffset - 1] || null
      }
    }
    
    return {
      offset: range.startOffset,
      textContent: '非文本节点',
      charBeforeCursor: null
    }
  }

  /**
   * 触发变量菜单
   */
  triggerVariableMenu() {
    const selection = window.getSelection()
    const range = selection.rangeCount > 0 ? selection.getRangeAt(0) : null
    
    if (range) {
      const rect = range.getBoundingClientRect()
      const editorRect = this.editorElement.getBoundingClientRect()
      
      const position = {
        x: Math.max(0, rect.left - editorRect.left),
        y: Math.max(0, rect.bottom - editorRect.top + 5)
      }
      
      if (typeof this.options.onVariableTrigger === 'function') {
        this.options.onVariableTrigger({ position })
      }
    }
  }

  /**
   * 获取新输入的内容
   * @param {string} currentContent - 当前内容
   * @returns {string} 新输入的内容
   */
  getNewInput(currentContent) {
    // 使用 textContent 来获取纯文本内容
    const currentText = this.editorElement.textContent || ''
    const lastText = this.lastTextContent || ''
    
    if (currentText.length > lastText.length) {
      const newText = currentText.slice(lastText.length)
      this.lastTextContent = currentText
      return newText
    }
    
    this.lastTextContent = currentText
    return ''
  }

  /**
   * 打印输入信息
   * @param {string} newInput - 新输入的内容
   * @param {string} currentContent - 当前完整内容
   * @param {number} wordCount - 当前字数
   */
  logInput(newInput, currentContent, wordCount) {
    console.log('=== 输入监听 ===')
    console.log('新输入内容:', newInput)
    console.log('当前完整内容:', currentContent)
    console.log('当前字数:', wordCount)
    console.log('字数变化:', wordCount - this.lastWordCount)
    console.log('================')
  }

  /**
   * 触发回调函数
   * @param {string} newInput - 新输入的内容
   * @param {string} currentContent - 当前完整内容
   * @param {number} wordCount - 当前字数
   */
  triggerCallbacks(newInput, currentContent, wordCount) {
    // 触发通用输入回调
    if (typeof this.options.onInput === 'function') {
      this.options.onInput({
        newInput,
        currentContent,
        wordCount,
        wordCountChange: wordCount - this.lastWordCount,
        timestamp: Date.now()
      })
    }

    // 触发内容变化回调
    if (typeof this.options.onContentChange === 'function') {
      this.options.onContentChange({
        content: currentContent,
        newInput,
        timestamp: Date.now()
      })
    }

    // 触发字数变化回调
    if (wordCount !== this.lastWordCount && typeof this.options.onWordCountChange === 'function') {
      this.options.onWordCountChange({
        wordCount,
        change: wordCount - this.lastWordCount,
        timestamp: Date.now()
      })
    }

    this.lastWordCount = wordCount
  }

  /**
   * 设置回调函数
   * @param {string} type - 回调类型 ('input', 'wordCount', 'content')
   * @param {Function} callback - 回调函数
   */
  setCallback(type, callback) {
    switch (type) {
      case 'input':
        this.options.onInput = callback
        break
      case 'wordCount':
        this.options.onWordCountChange = callback
        break
      case 'content':
        this.options.onContentChange = callback
        break
      default:
        console.warn(`InputListener: 未知的回调类型 '${type}'`)
    }
  }

  /**
   * 获取当前状态
   * @returns {Object} 当前状态信息
   */
  getStatus() {
    return {
      isListening: this.isListening,
      lastContent: this.lastContent,
      lastWordCount: this.lastWordCount,
      editorElement: !!this.editorElement
    }
  }
}

/**
 * 创建输入监听器实例的工厂函数
 * @param {Object} options - 配置选项
 * @returns {InputListener} 输入监听器实例
 */
export function createInputListener(options = {}) {
  return new InputListener(options)
}

/**
 * 简化的输入监听函数
 * @param {HTMLElement} editorElement - 编辑器DOM元素
 * @param {Function} callback - 回调函数
 * @param {Object} options - 配置选项
 * @returns {InputListener} 输入监听器实例
 */
export function listenToInput(editorElement, callback, options = {}) {
  const listener = new InputListener({
    onInput: callback,
    ...options
  })
  
  listener.startListening(editorElement)
  return listener
} 